.flex {
  display: flex;
}

.flex-wrap {
  flex-wrap: wrap;
}

.w-50 {
  width: 50%;
}

.w-100 {
  width: 100%;
}

.flex-1 {
  flex: 1;
}

.justify-center {
  justify-content: center;
}

.justify-between {
  justify-content: space-between;
}

.justify-end {
  justify-content: flex-end;
}

.align-center {
  align-items: center;
}

.padding {
  padding: 30px;
}

.padding-sm {
  padding: 20px;
}

.padding-xs {
  padding: 10px;
}

.padding-bottom {
  padding-bottom: 30px;
}

.padding-bottom-sm {
  padding-bottom: 20px;
}

.padding-bottom-xs{
  padding-bottom: 10px;
}

.margin-bottom {
  margin-bottom: 30px;
}

.margin-bottom-sm {
  margin-bottom: 20px;
}

.margin-bottom-xs {
  margin-bottom: 10px;
}


.margin-top {
  margin-top: 30px;
}

.margin-top-sm {
  margin-top: 20px;
}

.margin-top-xs {
  margin-top: 10px;
}

.margin-left {
  margin-left: 30px;
}

.margin-left-sm {
  margin-left: 20px;
}

.margin-left-xs {
  margin-left: 10px;
}

.margin-right {
  margin-right: 30px;
}

.margin-right {
  margin-right: 20px;
}

.margin-right {
  margin-right: 10px;

}

.box {
  width: 60px;
  height: 60px;
}

.box-sm {
  width: 40px;
  height: 40px;
}

.box-xs {
  width: 20px;
  height: 20px;
}

.one_text_hidden {
  display: block;
  white-space: nowrap !important;       /* 防止文本换行 */
  overflow: hidden !important;          /* 隐藏溢出内容 */
  text-overflow: ellipsis !important;   /* 显示省略号 */
}
